<template>
  <div class="shop-cart-wrapper" v-show="visible">
    <shop-cart
      ref="shopCart"
      :select-foods="selectFoods"
      :delivery-price="deliveryPrice"
      :min-price="minPrice"
      :fold="fold"></shop-cart>
  </div>
  </div>
</template>

<script>
import ShopCart from './shopCart'
import popupMixin from 'assets/mixins/popup.js'

export default {
  name: 'shopCartSticky',
  mixins: [popupMixin],
  props: {
    selectFoods: {
      type: Array,
      default() {
        return []
      }
    },
    deliveryPrice: {
      type: Number,
      default: 0
    },
    minPrice: {
      type: Number,
      default: 0
    },
    fold: {
      type: Boolean,
      default: true
    },
    listComp: {
      type: Object,
      default() {
        return {}
      }
    }
  },
  methods: {
    dropBall(target) {
      this.$refs.shopCart.dropBall(target)
    },
  },
  components: {
    ShopCart
  }
}
</script>

<style lang="stylus" scoped>
.shop-cart-wrapper {
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 100;
  width: 100%;
  height: 48px;
}
</style>